<template>
  <!--查杀毒记录表单-->
  <basic-dialog v-model="dialog.showDialog" :title="dialog.title" width="1200" :loading="dialog.loading"
                :autoClose="true" :hideFooter="dialog.type =='view'" :submitBtnLoading="dialog.submitBtnLoading"
                @submit="submitDialog" :submitBtnTxt="dialog.submitTxt" :submitBtnIcon="dialog.submitIcon">
    <el-card shadow="never" style="width: 100%; height: calc(100% - 260px);margin-bottom: 10px">
      <el-form ref="formRefs" :model="ruleForm" label-width="160px" label-position="top" >
        <el-row :gutter="0" class="border-bottom">
          <el-col :span="4" style=" display: flex;align-items: center;justify-content: center;">
            查杀病毒对象
          </el-col>
          <el-col :span="20">
            <el-row :gutter="0">
              <el-col :span="8">
                <el-form-item label="名称"class="border-bottom border-left form-label">
                  <el-input
                      class="border-top"
                      v-model="ruleForm.productName"
                      placeholder="请输入查杀病毒对象"
                      disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="型号" class="border-bottom border-left form-label" >
                  <el-input
                      class="border-top"
                      v-model="ruleForm.modelName"
                      placeholder="请输入型号"
                      disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="编号" class="border-bottom border-left form-label">
                  <el-input
                      class="border-top"
                      v-model="ruleForm.productCode"
                      placeholder="请输入编号"
                      disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="来源" class="border-left form-label">
                  <el-select
                      class="border-top"
                      v-model="ruleForm.source"
                      placeholder="请选择来源"
                      :disabled="typeDisabled"
                  >
                    <el-option
                        v-for="item in sourceData"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="来源时间" class="border-left form-label">
                  <div class="border-top" style="width:100%">
                    <el-date-picker
                        v-model="ruleForm.sourceTime"
                        type="date"
                        :disabled="typeDisabled"
                        placeholder="选择来源时间"
                    >
                    </el-date-picker>
                  </div>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="查杀病毒时机"  class="border-left form-label" >
                  <el-select
                      class="border-top"
                      v-model="ruleForm.antivirusOpportunity"
                      :disabled="typeDisabled"
                      placeholder="请选择来源"
                  >
                    <el-option
                        v-for="item in opportunityData"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
        <el-row :gutter="0" class="border-bottom">
          <el-col :span="8">
            <el-form-item label="防病毒软件及版本" class="border-right form-label">
              <el-input
                  class="border-top"
                  v-model="ruleForm.softwareAndVersion"
                  :disabled="typeDisabled"
                  placeholder="请输入内容"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="查杀处理是否有毒？" class="form-label">
              <el-radio-group class="border-top" style="width:100%" v-model="ruleForm.toxic" :disabled="typeDisabled">
                <el-radio label="true">是</el-radio>
                <el-radio label="false">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="查杀处理时间" class="border-left form-label">
              <div class="border-top" style="width:100%">
                <el-date-picker
                    v-model="ruleForm.antivirusTime"
                    type="date"
                    placeholder="选择查杀处理时间"
                    :disabled="typeDisabled"
                >
                </el-date-picker>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="0" class="border-bottom">
          <el-col :span="4" style="font-weight:bold;display: flex;align-items: center;justify-content: center;padding: 0 25px">
            查杀病毒结果(包括病毒名，文件名及数量等)
          </el-col>
          <el-col :span="20">
            <el-form-item label="" class="form-label">
              <el-input
                  class="border-left"
                  type="textarea"
                  :rows="9"
                  v-model="ruleForm.doResult"
                  placeholder="请输入内容"
                  :disabled="typeDisabled"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="2" style="font-weight:bold;display: flex;align-items: center;justify-content: center;">处理人</el-col>
          <el-col :span="6">
            <el-form-item label="" :rules="[{ required: true, message: '处理人必填' }]">
              <el-input
                  class="border-left border-right"
                  v-model="ruleForm.processedUserName"
                  :disabled="typeDisabled"
                  placeholder="请选择处理人"
                  @click="openUserRefer('processedUserName')"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="2" style="font-weight:bold;display: flex;align-items: center;justify-content: center;">检验</el-col>
          <el-col :span="6">
            <el-form-item label="" class="border-left border-right form-label">
              <el-input
                  v-model="ruleForm.inspectorName"
                  placeholder="检验完成后回显"
                  disabled
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="2" style="font-weight:bold;display: flex;align-items: center;justify-content: center;">用户代表</el-col>
          <el-col :span="6">
            <el-form-item label="" class="border-left form-label">
              <el-input
                  v-model="ruleForm.representativeName"
                  :disabled="typeDisabled"
                  placeholder="请选择用户代表"
                  @click="openUserRefer('representativeName')"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>

    <BasicCrudUserRefer ref="crudReferRef" v-model="UserVisible"
                        @submit="handleSetWorkerNameSubmit"></BasicCrudUserRefer>
  </basic-dialog>
</template>

<script setup>
import {defineExpose, ref} from "vue";
import { useUserStore } from '@/store/user'
import {ElMessage} from "element-plus";
import { formatDate } from "@/utils/formatTime";
import { postAdd, putEdit } from "@/apis/mes/workAntivirusRecord";
const { userInfo } = useUserStore()

const emits = defineEmits(['refresh-parent'])

const dialog = ref({
  showDialog: false,
  type: "add",
  title: "查杀毒记录",
  loading:false
})
const ruleForm = ref({});
const typeDisabled = ref(false);

// 打开新增编辑对话框
const openDialog = (event) => {
  dialog.value.showDialog = true;
  dialog.value.type = event.type;
  typeDisabled.value= event.type=='view'
  ruleForm.value={}
  if (event.type === "add") {
    dialog.value.title = "新增";
    dialog.value.submitTxt = "保存";
    dialog.value.submitIcon = "el-icon-plus";
    ruleForm.value.processTaskId = event.processTaskId;
    const { pdmProductName, pdmProductCode, modelName } = event.workOrder;
    ruleForm.value.modelName = modelName;
    ruleForm.value.productName = pdmProductName;
    ruleForm.value.productCode = pdmProductCode;
    ruleForm.value.processedPersonId = userInfo.id;
    ruleForm.value.processedUserName = userInfo.name;
  } else if (event.type === "edit") {
    dialog.value.title = "修改";
    dialog.value.submitTxt = "修改";
    dialog.value.submitIcon = "el-icon-edit";
    /**
     * 表单赋值(不把所有传递给后端)，参照不清楚怎么赋值
     * 取值：const {这里面写row里面的字段名} = event.row;
     * 赋值： this.ruleForm = {上面的花括号的字段名}
     * 如果需要全部传递给后端直接 this.ruleForm = event.row
     * */
    ruleForm.value = event.row;
  } else if (event.type === "view") {
    dialog.value.title = "查看";
    ruleForm.value = event.row;
  }
};

const sourceData= [
  {
    value: "情报档案部",
    label: "情报档案部",
  },
  {
    value: "信息部",
    label: "信息部",
  },
  {
    value: "产品部",
    label: "产品部",
  },
  {
    value: "随XXX设备配套",
    label: "随XXX设备配套",
  },
]
const opportunityData= [
  {
    value: "例行检查",
    label: "例行检查",
  },
  {
    value: "抽检",
    label: "抽检",
  },
  {
    value: "入所检查",
    label: "入所检查",
  },
  {
    value: "出所检查",
    label: "出所检查",
  },
]

const formRefs=ref(null)
const submitDialog=()=> {
  formRefs.value.validate((valid,done) => {
    if (valid) {
      if (dialog.value.type === "add") {
        add(done);
      } else if (dialog.value.type === "edit") {
        edit(done);
      }
    } else {
      return false;
    }
  });

}

// 新增
const add=(done)=> {
  dialog.value.loading = true;
  if (ruleForm.value.sourceTime) {
    ruleForm.value.sourceTime = formatDate(ruleForm.value.sourceTime, "yyyy-MM-dd");
  }
  if (ruleForm.value.antivirusTime) {
    ruleForm.value.antivirusTime = formatDate(ruleForm.value.antivirusTime, "yyyy-MM-dd");
  }
  postAdd(ruleForm.value).then((res) => {
    ElMessage.success("新增数据成功!");
    dialog.value.showDialog = false;
    ruleForm.value = {};
    emits('refresh')
  }).finally((res) => {
    dialog.value.loading = false;
    done && done()
  });
}
// 编辑
const edit=(done) => {
  dialog.value.loading = true;
  if (ruleForm.value.sourceTime) {
    ruleForm.value.sourceTime = formatDate(ruleForm.value.sourceTime, "yyyy-MM-dd");
  }
  if (ruleForm.value.antivirusTime) {
    ruleForm.value.antivirusTime = formatDate(ruleForm.value.antivirusTime, "yyyy-MM-dd");
  }
  putEdit(ruleForm.value).then((res) => {
    ElMessage.success("修改数据成功!");
    dialog.value.showDialog = false;
    ruleForm.value = {};
    emits('refresh')
  }).finally((res) => {
    dialog.value.loading = false;
    done && done()
  });
}

const UserVisible = ref(false);
const selectUserType = ref('');
const crudReferRef=ref(null)
const openUserRefer=(type)=>{
  selectUserType.value=type;
  UserVisible.value = true;
}
// 用户参照回填
const handleSetWorkerNameSubmit = (selections) => {
  if(selections?.length>0) {
    if (selectUserType.value === 'processedUserName') {
      ruleForm.value.processedPersonId = selections.map(val => val.id).join(",");
      ruleForm.value.processedUserName = selections.map(val => val.name).join(",");
    }
    if (selectUserType.value === 'representativeName') {
      ruleForm.value.representativeId = selections.map(val => val.id).join(",");
      ruleForm.value.representativeName = selections.map(val => val.name).join(",");
    }
  }
  crudReferRef.value.handlerCancel();
};
defineExpose({
  openDialog
})
</script>

<style lang="scss" scoped>
::v-deep {
  .el-card__body {
    padding: 0 !important;
  }
  .el-form .el-form-item {
    margin: 0 !important;
    text-align: left;
  }
  .el-input__wrapper,.el-select__wrapper,.el-textarea__inner {
    box-shadow: none !important;
    border: none;
    width:100%
  }
  .el-form-item__label {
    text-align: left !important;
    margin: 0 !important;
    padding-left: 15px;
    box-sizing: border-box;
    height: 40px !important;
    line-height: 40px !important;
    font-weight: bold
  }
  .el-input__inner,.el-select__wrapper {
    border: none !important;
    height: 40px !important;
    line-height: 40px !important;
  }
  .el-date-editor.el-input, .el-date-editor .el-input__wrapper {
    height: 40px !important;
    line-height: 40px !important;
    width:100%
  }
  .el-form-item__content{
    width:100%;
    line-height: 40px !important;
  }
  .el-radio.el-radio--small{
    height: 40px;
    margin-left: 20px;
    margin-top: 0;
    margin-bottom: 0;
  }

  .el-input.is-disabled .el-input__wrapper,.el-textarea.is-disabled .el-textarea__inner,.el-select__wrapper.is-disabled{
    background-color: #ffffff;
  }
}
.border-right {
  border-right: 1px solid var(--border-color);
}
.border-left {
  border-left: 1px solid var(--border-color);
}
.border-top {
  border-top: 1px solid var(--border-color);
}
.border-bottom {
  border-bottom: 1px solid var(--border-color);
}
.form-label {
  width: 100%;
}
</style>